<template>
  <button :style="{backgroundColor:btncolor }">
    {{title}}
  </button>
</template>

<script>
export default {
  props: ['title', 'type'],
  data () {
    return {

    }
  },
  computed: {
    btncolor () {
      if (this.type === 'primary') return 'blue'
      if (this.type === 'success') return 'green'
      if (this.type === 'warning') return '#ebb563'
      if (this.type === 'info') return '#909399'
      if (this.type === 'danger') return '#f56c6c'
      return 'white'
    }
  },
  created () {

  },

  methods: {

  }
}
</script>

<style scoped lang='less'>
  button{
    width: 104px;
    height: 40px;
    border: 1px solid #ccc;
    border-radius: 20px;

  }
</style>
